class RenderXQY extends Render {
  constructor() {
    super()
    this.getData()
  }
  //获取数据
  getData() {
    let renderXQY_this = this
    //获取页面并渲染页面
    $.ajax({
      type: "GET",
      url: "/data_xqy_xq",
      data: window.location.search,
      success: function (response) {
        response = response.replace(
          /(\/\/qq\-pc\-1252317822\.file\.myqcloud\.com\/static\/app\.cddd446e9f97ef1a6534\.css)/g,
          `../css/app.cddd446e9f97ef1a6534.css`)
        response = response.replace(
          /(\/\/qq\-pc\-1252317822\.file\.myqcloud\.com\/static\/index\.5374b48ba47a5e72ddaa\.css)/g,
          `../css/index.5374b48ba47a5e72ddaa.css`)
        response = response.replace(
          /(\/\/qq\-pc\-1252317822\.file.myqcloud\.com\/static\/pages\/book\-detail\/index\.5374b48ba47a5e72ddaa\.css)/g,
          `../css/index.5374b48ba47a5e72ddaa.css`)
        response = response.replace(
          /(\/\/qq\-pc\-1252317822\.file.myqcloud\.com\/static\/pages\/book-detail\/index\.5374b48ba47a5e72ddaa\.css)/g,
          `../css/index.5374b48ba47a5e72ddaa.css`)
        response = response.replace(
          /(\/\/qq\-pc\-1252317822\.file\.myqcloud.com\/static\/img\/logo-nav\.1cb9895\.png)/g,
          `../static/logo-nav.1cb9895.png`)
        renderXQY_this.renderXQY(response)
      }
    });
  }
  //渲染完根页面后渲染其他东西
  renderXQY(data) {
    let renderXQY_this = this
    //渲染根目录
    console.log($(`body`));
    document.body.innerHTML = data
    //插入搜索轮子
    let queryScript = document.createElement(`script`)
    queryScript.src = `../js/query.js`
    document.body.appendChild(queryScript)
    //插入登陆轮子
    let loginScript = document.createElement(`script`)
    loginScript.src = `../js/login.js`
    document.body.appendChild(loginScript)
    //登陆自裁
    $(`.unlogin`).remove()
    //扫码下载自裁
    $(`.qrcode-wrapper-large`).remove()
    //获取推荐渲染，并回调操作函数
    $.ajax({
      type: "GET",
      url: "/data_xqy_tj",
      data: window.location.search.substring(1),
      success: function (response) {
        renderXQY_this.renderTJ(response)
        renderXQY_this.clickCallback()
      }
    })
    //获取目录数据并渲染
    $.ajax({
      type: "GET",
      url: "/data_xqy_ml",
      data: window.location.search.substring(1),
      success: function (response) {
        renderXQY_this.renderML(response)
      }
    })
    //获取页面信息
    $.ajax({
      url: "/data_xqy_wz",
      type: "get",
      data: {
        'bid': `${window.location.search.substring(5)}`
      },
      //取出文章内容
      success: function (res) {
        const ret = /firstChapterContent([\s\S]+?)}}/.exec(res)[1].replace(`:`, "").replaceAll(`"`, "").substring(2)
        renderXQY_this.renderWZ(ret)
      }
    })
  }
  //渲染后回调的操作函数
  clickCallback() {
    let renderXQY_this = this
    let sort = 0
    //目录和文章的tab切换
    tabNav(`ypc-column-name`, `tabs-active`, `tab-panel`)
    //点击正序和反序，重新渲染
    $(`.order`).click(function () {
      //记录正序和反序
      sort++
      //获取数据
      $.ajax({
        type: "GET",
        url: "/data_xqy_ml",
        data: window.location.search.substring(1),
        success: function (response) {
          renderXQY_this.renderML(response, sort)
        }
      })
    })

    //点击刷新推荐
    $(`.action`).click(function () {
      $.ajax({
        type: "GET",
        url: "/data_xqy_tj",
        data: window.location.search.substring(1),
        success: function (response) {
          renderXQY_this.renderTJ(response)
          renderXQY_this.clickCallback()
        }
      })
    })

    //获取书架是否有这本书
    $.ajax({
      type: "GET",
      url: "../server/querybook.php",
      data: `${window.location.search.substring(1)}&bname=${$(`.book-title`).children(`span`).text()}&username=${getCookie(`username`)}`,
      success: function (response) {
        renderXQY_this.addBook(response)
      }
    })

    //点击看第二章
    $(`.ypc-btn-primary`).eq(2).click(function () {
      window.location.href = `http://dushu.qq.com/read.html${window.location.search}}&cid=2&`
    })
    //点击看第一章
    $(`.ypc-btn-primary`).eq(1).click(function () {
      window.location.href = `http://dushu.qq.com/read.html${window.location.search}}&cid=1&`
    })

  }
  //渲染目录，默认为正序
  renderML(data, sort = 0) {
    let renderXQY_this = this
    let renderDir = ``
    //如果反序则，
    if (sort % 2 === 1) {
      for (let i = data.data.length; i > 0; i--) {
        $(`.order`).children(`span`).text(`正序`)
        $(`.order`).children(`i`).removeClass(`icon-sorting-up`)
        $(`.order`).children(`i`).addClass(`icon-sorting-down`)
        renderDir += `
        <div data-v-06154db9="" class="list ypc-link" onclick="location.href='http://dushu.qq.com/read.html${window.location.search}&cid=${data.data[i-1].cid}&'">
          <p data-v-06154db9="" class="name">${data.data[i-1].chapterName}</p>
        </div>
        `
      }
      //否则正序
    } else {
      $(`.order`).children(`span`).text(`倒序`)
      $(`.order`).children(`i`).removeClass(`icon-sorting-down`)
      $(`.order`).children(`i`).addClass(`icon-sorting-up`)
      for (let i = 0; i < data.data.length; i++) {
        renderDir += `
      <div data-v-06154db9="" class="list ypc-link" onclick="location.href='http://dushu.qq.com/read.html${window.location.search}&cid=${data.data[i].cid}&'">
        <p data-v-06154db9="" class="name">${data.data[i].chapterName}</p>
      </div>
      `
      }
    }
    //弄好的字符串放进去
    renderXQY_this.renderHTML($(`.book-dir`), renderDir)
    //渲染有多少章
    renderXQY_this.renderHTML($(`.ypc-column-name`).eq(1), `目录(${data.data.length}章)`)

  }
  //渲染文章
  renderWZ(data) {
    let renderXQY_this = this
    //替换换行
    data = data.replace(
      /(\\r\\n)/g, `<br><br>`)
    let a = `<p>${data}</p> `
    $(`.chapter-content`).append(a)
  }
  //渲染推荐
  renderTJ(data) {
    let renderXQY_this = this
    let renderColumn_a = ``
    //循环字符串
    for (let i = 0; i < 5; i++) {
      renderColumn_a += `
      <div data-v-1d58fbb8="" data-v-08b247d2="" class="book-horizontal" onclick="location.href='http://127.0.0.1:8080/QQLB/src/pages/QQread-book.html?bid=${data.data.sameCategoryRec.books[i].bid}'">
      <div data-v-1d58fbb8="" class="book-cover"><img data-v-1d58fbb8=""
          src="https://wfqqreader-1252317822.image.myqcloud.com/cover/${data.data.sameCategoryRec.books[i].bid%1000}/${data.data.sameCategoryRec.books[i].bid}/b_${data.data.sameCategoryRec.books[i].bid}.jpg" alt=""
          class="ypc-book-cover">
        <!---->
      </div>
      <div data-v-1d58fbb8="" class="book-info">
        <div data-v-1d58fbb8="" class="book-title">${data.data.sameCategoryRec.books[i].title}</div>
        <div data-v-1d58fbb8="" class="book-desc">
        ${data.data.sameCategoryRec.books[i].intro}
        </div>
        <div data-v-1d58fbb8="" class="book-survey"><span data-v-1d58fbb8="" class="author">${data.data.sameCategoryRec.books[i].author}</span> <span
            data-v-1d58fbb8="">·${data.data.sameCategoryRec.books[i].category3Name}</span> <span data-v-1d58fbb8="">·连载</span> <span data-v-1d58fbb8="">·${parseInt(data.data.sameCategoryRec.books[i].totalWords/10000)}万字</span>
        </div>
        <!---->
      </div>
    </div>
      `
    }
    //循环好塞进头
    let renderColumn_b = `
          <div data-v-08b247d2="" class="column">
          <div data-v-08b247d2="" class="column-header">
            <div data-v-08b247d2="" class="ypc-column-name">同类热门书</div>
            <div data-v-08b247d2="" class="action ypc-link"><span data-v-08b247d2="">换一换</span> <i data-v-08b247d2=""
                class="iconfont icon-refresh"></i></div>
          </div>
          <div data-v-08b247d2="" class="book-wrap">
          ${renderColumn_a}
          </div>
          </div>
    `
    //塞进标签
    renderXQY_this.renderHTML($(`.rec-books`), renderColumn_b)
  }
  //加入书架
  addBook(data) {
    let renderXQY_this = this
    let login = getCookie(`login`)
    if (data == 1) {
      $(`.is-plain`).addClass(`ypc-btn-disabled`)
      $(`.is-plain`).children(`span`).text(`已在书架`)
    } else if (data == 0) {

      $(`.is-plain`).click(function () {
        if (login == 1) {
          let username = getCookie(`username`)
          let bid = window.location.search.substring(1)
          let bneme = $(`.book-title`).children(`span`).text()
          $.ajax({
            type: "GET",
            url: "../server/addbook.php",
            data: `${bid}&bname=${bneme}&username=${username}`,
            success: function (response) {
              console.log(response);
              renderXQY_this.getData()
            }
          })
        } else {
          window.location.href = `http://127.0.0.1:8080/QQLB/src/pages/login.html`
        }

      })
    }

  }
}